﻿<%@ Page Title="小类细项占比设置" Language="C#" MasterPageFile="~/master/m.master" %>

<script runat="server"></script>

<asp:Content ID="Content3" ContentPlaceHolderID="head" runat="Server">

    <link href="../assets/css/plugins/boxdrop/boxDrop.css" rel="stylesheet" />
    <link href="../assets/css/plugins/bootstrap-datepicker/bootstrap-datepicker.min.css" rel="stylesheet" />
    <link href="../assets/css/plugins/jQuery-DataTables/css/dataTables.bootstrap.min.css" rel="stylesheet" />
    <link href="../assets/js/plugins/fancybox/jquery.fancybox.css" rel="stylesheet">
    <link href="../assets/css/plugins/bootstrap-select/bootstrap-select.min.css" rel="stylesheet" />
    <link href="../assets/img/validate/validate.css" rel="stylesheet">
    <style type="text/css">
        iframe, html, body, .system-box, .right-side { overflow: hidden !important; background-color: white !important; }
        .system-box .right-side { width: 100%; height: 98%; margin: 0px !important; padding: 0px !important; }
        .condition { padding: 2px 0 }
        .condition-container { padding-bottom: 0px; }
        .line-height-34 { line-height: 39px }
        #main-body { /*min-height: 300px;*/ }
        #main-body th { text-align: center }
        .td-bgcolor { /*background-color: #F5F5F6*/ }
        .total { font-weight: 700; }
        .totalTr > .td-bgcolor { background-color: #eee; }
        .totalTr { /*border: 1px solid darkgray !important;*/ }
        .sub-item { width: 50px; }

        #setskcWindow { width: 520px; margin: 10px auto; }

        .history-ul { padding: 0px; text-align: center; }
        .history-li { list-style: none; font-size: 14px; line-height: 32px; border: solid 1px lightgray; cursor: pointer; }
        .search-input { /*width: 118px;*/ }
        .bg-selected { background-color: #dff0d8; }
        .future-selected { background: linear-gradient(135deg, #fff 74%, #00a0e5 78%, #00a0e5 100%); }
        .FutureWeek { padding: 0px !important; }
        #FutureWeek { padding: 0px !important; /*height:400px !important;*/ }
        .FutureWeek-ul { padding: 0px !important; /*height: 400px !important;*/ }
        .FutureWeek-ul::-webkit-scrollbar { width: 6px; height: 6px; background-color: #F5F5F5; }
        .FutureWeek-li { float: left; list-style: none; font-size: 14px; line-height: 32px; border: 2px solid lightgray; cursor: pointer; width: 62px; margin: 1px; text-align: center; }
        /*应用周列表中已经设置过的周样式*/
        .FutureWeek-li-set { border: 2px solid green; box-sizing: border-box; }
        .nopadding { padding: 0px !important; }
        #saveModuleBtn { margin-right: 160px !important; }
        .system-box { min-width: 940px; }

        .width40 { width: 40px; margin-left: 5px; margin-right: 5px; }
        .width80 { width: 80px; margin-left: 5px; }
        .width120 { width: 120px; }
        .width300 { width: 300px !important; }
        .width300 input { width: 300px !important; }
        .floatLeft { float: left !important; }
        .conditionButton { margin-left: 10px !important; }
        .backselect { color: #333; background-color: #fff; border-color: #ccc; padding: 5px 8px; }
        .detail { /*width: 120px;*/border-left: 2px solid darkgray !important; }

        /*#copyWindow div.modal-dialog { height: 400px !important; overflow: scroll !important; }
        #copyWindow div.modal-body {height: 300px !important;overflow-y: scroll !important;overflow-x: hidden !important;padding: 0px !important;}
        #copyWindow div.modal-body .row {margin: 0px !important;}*/
        
        .modal-body::-webkit-scrollbar {width: 6px;height: 6px;background-color: #F5F5F5;}
        .dataTables_scrollBody::-webkit-scrollbar {width: 6px;height: 6px;background-color: #F5F5F5;}


        .dataTables_scrollHead th {text-align: center;}
        .total-percentage, .total-standardskc {color: red;}
        .dataTables_scrollHead th:nth-child(2) {width: 100px;}
        .dataTables_scrollHead th:nth-child(3) {width: 70px;}
        .dataTables_scrollHead th:nth-child(4) {width: 70px;}
        .sub-table {padding: 0px !important;margin: 0px !important;border: 0px !important;}
        .sub-table tr th {width: 90px !important;padding: 0px !important;}
        .sub-table tr td {width: 90px !important;padding: 0px !important;}
        .sub-table th {border-top: 0px solid darkgray !important;}
        .sub-table tr th:nth-child(1) {border: 0px !important;}
        .sub-table tr td:nth-child(1) {border-left: 0px !important;}
        #main-body tr[role='row'] td:nth-child(5) {padding: 0px !important;}
        i.icon {position: relative;right: -23px;bottom: 23px;color: white;}
        .editTitle {font-weight: bold;}
        li.list-group-item {padding: 0px !important;}
        .left-week, .right-week {padding: 0px !important;}
        .left-title, .right-title {height: 25px;/*font-weight: 530;*/font-size: 14px; padding-left: 10px !important;}


        .module-info td {width: 80px !important;padding-bottom: 10px;}
        .module-info td .control-label{ margin-right: 0px;}
        .module-info .form-group {margin-bottom: 0px;}
        .module-info .control-label {text-align: right;min-width: 80px;width: 80px;}
        .inmodal .modal-body{ padding: 0 !important;}

        .modal-open .modal {overflow-x: hidden;overflow-y: hidden;}
        ::-webkit-scrollbar { width: 6px; height: 0px; background-color: #F5F5F5; }
        #copyWindow .history-week { height: 300px; overflow: auto; }
        #copyWindow { width: 800px; height: 480px; margin: 10px auto; }

        .condition label{ margin: 0;}

        #main-body_paginate{ margin-top: 10px; margin-right: 10px;}
    </style>
</asp:Content>

<asp:Content ID="Content4" ContentPlaceHolderID="main" runat="Server">
    <div class="system-box">
        <div class="right-side">
            <!-- loading buttons start-->
            <div class="btns-container"></div>
            <!-- loading buttons end-->

            <!-- loading copy start-->
            <div class="modal inmodal" id="copyWindow" tabindex="-1" role="dialog" aria-hidden="true">
                <form id="copyModuleForm" method="get" action="#">
                    <div class="modal-dialog" style="width:630px">
                        <div class="modal-content">
                            <div class="modal-header">
                                <span class="editTitle">复制周占比</span>
                                <button type="button" class="close" data-dismiss="modal">
                                    <span aria-hidden="true">&times;</span>
                                    <span class="sr-only">关闭</span>
                                </button>
                            </div>
                            <div id="copymessage" style="display: none"></div>
                            <div class="modal-body">
                                <div class="row" style="width: 615px; display: table-cell;">
                         
                                        
                                        <div class="col-lg-3 col-sm-3 left-week">
                                            <div class="panel nopadding">
                                                <div class="panel-heading nopadding left-title">历史周占比列表</div>
                                                <div class="panel-body history-week nopadding">
                                                    <div class="panel panel-collapse">
                                                        <div class="panel-heading panel-default nopadding">
                                                            <input id="search-left" type="text" class="form-control search-input" placeholder="输入年份周" />
                                                        </div>
                                                        <div class="panel-body nopadding" id="GetLeftTitle">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-lg-9 col-sm-9 right-week">
                                            <div class="panel nopadding">
                                                <div class="panel-heading nopadding right-title">应用周列表</div>
                                                <div class="panel-body nopadding" id="FutureWeek" style="height: 305px; overflow: auto;">
                                                </div>
                                            </div>
                                        </div>

                                </div>

                            </div>
                            <div class="modal-footer">
                                <button type="button" id="copyModuleBtn" class="btn btn-primary">应用</button>
                                <button type="button" id="closeAddBox" class="btn btn-danger" data-dismiss="modal">关闭</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <!-- loading copy end-->

            <!-- loading setskc start-->
            <div class="modal inmodal" id="setskcWindow" tabindex="-1" role="dialog" aria-hidden="true">
                <form id="checkModuleForm" method="get" action="#">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header">
                                <span class="editTitle">批量设置标准SKC</span>
                                <button type="button" class="close" data-dismiss="modal">
                                    <span aria-hidden="true">&times;</span>
                                    <span class="sr-only">关闭</span>
                                </button>
                            </div>
                            <div id="message" style="display: none"></div>
                            <div class="modal-body">
                                <table class="module-info" cellpadding="0" cellspacing="0">
                                    <thead style="height: 10px;display: block;"></thead>
                                    <tbody>
                                        <tr>
                                            <td style="width: 81px;">
                                                <label class="control-label">年/周&nbsp;&nbsp;</label>
                                            </td>
                                            <td>
                                                <div class="form-group">
                                                   
                                                        <select class="form-control required" id="search-skc-year" datacol="yes" err="请选择年 - " checkexpession="NotNull">
                                                            <option value="">请选择</option>
                                                        </select>
                                                        <select class="form-control required" id="search-skc-week" datacol="yes" err="请选择周 - " checkexpession="NotNull">
                                                            <option value="">请选择</option>
                                                        </select>
                                                    </div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td style="width: 81px;">
                                                <label class="control-label">大类&nbsp;&nbsp;</label>
                                            </td>
                                            <td>
                                                <select id="search-skc-category" class="form-control selectpicker required" data-width="300px" data-style="backselect" data-live-search="true" multiple datacol="yes" err="请选择大类 - " checkexpession="NotNull"></select>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td style="width: 81px;">
                                                <label class="control-label">小类/细项</label>
                                            </td>
                                            <td>
                                                <select id="search-ItemNames" class="form-control selectpicker" data-width="300px" data-style="backselect" data-live-search="true" multiple></select>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td style="width: 81px;">
                                                <label class="control-label">性别</label>
                                            </td>
                                            <td>
                                                <select class="form-control width300 required" id="search-skc-gender" datacol="yes" err="请选择性别 - " checkexpession="NotNull">
                                                    <option value="">请选择</option>
                                                </select>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td style="width: 81px;">
                                                <label class="control-label">标准SKC数&nbsp;&nbsp;</label>
                                            </td>
                                            <td>
                                                <input type="number" id="skc" name="skc" placeholder="只能输入数字" maxlength="10" class="form-control input-w300 required" datacol="yes" err="请输入正确的标准SKC数" checkexpession="NotNull" />
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                            <div class="modal-footer">
                                <button type="button" id="saveModuleBtn" class="btn btn-primary">保存</button>
                                <button type="button" id="closeModuleBox" class="btn btn-white" data-dismiss="modal">关闭</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <!-- loading setskc end-->

            <!-- loading search condition start-->
            <div class="condition" style="overflow: visible;">
                <table>
                    <tr class="line-height-34">
                        <td>
                            <div class="width80">
                                <label>
                                    <input type="radio" name="detail" id="radio-history" class="line-height-34" checked>历史销售
                                </label>
                            </div>
                        </td>
                        <td>
                            <div class="width80">
                                <label>
                                    <input type="radio" name="detail" id="radio-week" class="line-height-34" />按周查询
                                </label>
                            </div>
                        </td>
                        <td>
                            <div class="width40 text-right">
                                <label>年周:</label>
                            </div>
                        </td>
                        <td>
                            <div class="width120  no-padding">
                                <select class="form-control" id="search-year" disabled>
                                    <option value="">请选择</option>
                                </select>
                            </div>
                        </td>
                        <td>
                            <div class="width120  no-padding">
                                <select class="form-control" id="search-week" disabled>
                                    <option value="">请选择</option>
                                </select>
                            </div>
                        </td>
                        <td>
                            <div class="width40 text-right">
                                <label class="no-padding">大类:</label>
                            </div>
                        </td>
                        <td>
                            <div class="width120">
                                <select id="search-KindNames" class="form-control selectpicker " data-width="110px" data-style="backselect" data-live-search="true" multiple></select>

                            </div>
                        </td>
                        <td>
                            <div class="width40 text-right">
                                <label class=" no-padding">性别:</label>
                            </div>

                        </td>
                        <td>
                            <div class="width120">
                                <div class="input-group text-center">
                                    <select class="form-control input-w110" id="search-Gender">
                                        <option value="">请选择</option>
                                    </select>
                                </div>
                            </div>
                        </td>
                    </tr>
                </table>




            </div>
            <!-- loading search condition end-->

            <!-- loading body start-->
            <div class="table-container no-padding">
                <table class="table table-bordered text-center full-width" id="main-body" style="table-layout:fixed">
                    <thead class="dataTables_scrollHead">
                        <tr>
                            <th style="width:30px;">
                                <input type="checkbox" class="checkbox select-all" /></th>
                            <th>历史/自然周</th>
                            <th>大类</th>
                            <th>性别</th>
                            <th>小类细项占比</th>
                        </tr>
                    </thead>

                </table>
            </div>
            <!-- loading body end-->
        </div>
    </div>

</asp:Content>

<asp:Content ID="Content5" ContentPlaceHolderID="footer" runat="Server">

    <script src="../assets/js/page/rScroll.js"></script>

    <script src="../assets/js/plugins/bootstrap-suggest/bootstrap-suggest.min.js"></script>
    <script src="../assets/js/plugins/bootstrap-suggest/itemSuggest.js"></script>
    <script src="../assets/js/plugins/bootstrap-datepicker/bootstrap-datepicker.min.js"></script>

    <!--jquery datatables-->
    <script src="../assets/js/plugins/dataTables/datatables.min.js"></script>
    <script src="../assets/js/plugins/jQuery-DataTables/dataTables.bootstrap.min.js"></script>


    <script src="../assets/js/plugins/fancybox/jquery.fancybox.js"></script>

    <script src="../assets/js/plugins/bootstrap-select/bootstrap-select.min.js"></script>
    <script src="../assets/js/plugins/bootstrap-select/i18n/defaults-zh_CN.min.js"></script>

    <script src="../assets/img/validate/learunui-validator.js"></script>
    <script>
        $('document').ready(function () {

            //模块ID
            var ModuleID = Y.getUrlParam("ModuleID");
            commonUtil.loadBtnList(ModuleID, function () {
                $('#btn-save').attr('disabled', 'disabled');
                rScroll();
            });

            var nmCommonBindList = function (controller, action, params, els, value, text, size, callback) {
                Y.API2(controller, action, params, function (data) {
                    if (data.Success == false) {
                        swal(data.Message, '', 'error');
                    } else {
                        var html = '';
                        data.map(function (item) {
                            html += '<option value=' + item[value] + '>' + item[text] + '</option>';
                        });
                        els.map(function (item) {
                            $(item).append(html);
                            $(item).selectpicker({ size: size || 8, 'title': '请选择' });
                            $(item).selectpicker('refresh');
                        });
                        if (typeof callback === "function") {
                            callback();
                        }
                    }
                });
            };

            //绑定大类
            //大类
            var nmGetKindInfo = function (els, size, callback) {
                nmCommonBindList('Common', 'GetKindInfo', {}, els, 'KindID', 'KindName', size, callback);
            }
            //小类细项
            var nmGetItemInfo = function (els, params, size, callback) {
                nmCommonBindList('Common', 'GetItemInfo', { kindIds: params }, els, 'ItemorSub', 'ItemorSub', size, callback);
            }

            nmGetKindInfo(['#search-KindNames']);
            nmGetKindInfo(['#search-skc-category']);
            //nmGetItemInfo(['#search-ItemNames']);
            //大类获取小类
            $(document).on("change", "#search-skc-category", function () {
                $("#search-ItemID").html('<option value="">请选择</option>');
                var ids = $(this).val();
                if (ids == "" || ids == null) {
                    return;
                }
                nmGetItemInfo(['#search-ItemNames'], ids.join(',')); //小品类
            });
            //没有数据也初始化一下表格
            $('#search-Item').selectpicker({ size: 6, 'title': '请选择' });
            $('#search-Item').selectpicker('refresh');
            //绑定性别
            var bindGender = function (els, callback) {
                Y.API2('Common', 'GetSexInfo', {}, function (data) {
                    if (data.Success == false) {
                        swal(data.Message, '', 'error');
                    } else {
                        var html = '';
                        data.map(function (item) {
                            html += '<option value=' + item.SexId + '>' + item.SexName + '</option>';
                        });
                        els.map(function (item) {
                            $(item).append(html);
                        });
                        if (typeof callback === "function") {
                            callback();
                        }
                    }
                });
            }
            bindGender(['#search-Gender', '#search-skc-gender']);

            var param_items_gender = { kindIds: $('#search-Gender').val() };

            //绑定年份
            commonUtil.bindDict({ DictValue: 'year' }, ['#search-year', '#search-skc-year']);

            //生成周
            var generateWeeks = function (id) {
                var content = "<option value=''>请选择</option>";
                for (var i = 1; i < 54; i++) {
                    content += '<option value=' + i + '>' + i + '</option>';
                }
                $(id).html(content);
            }
            generateWeeks("#search-week");
            generateWeeks("#search-skc-week");

            var Page = 1;

            //处理数据
            var ProcessData = function (result) {
                if (result.Success === false) {
                    swal(result.Message, '', 'error');
                    return [];
                } else {
                    result.recordsTotal = result.Data.RecordCount;
                    result.recordsFiltered = result.Data.RecordCount;
                    result.data = result.Data.Items;
                    return result.data;
                }
            }


            //计算表格高度
            var ua = navigator.userAgent.toLowerCase();
            var calcTableHeight = function () {
                var tableHeight = 0;
                //开始时候表格可能没有初始化,取默认高度40
                var headHeight = $('.dataTables_scrollHead').outerHeight(true) || 40;
                //提供不同浏览器兼容计算
                if (ua.indexOf('chrome') > -1) {
                    tableHeight = $('.right-side').outerHeight() - $('.btns-container').outerHeight(true) - $('.condition-container').outerHeight(true) - headHeight - 86;
                } else {
                    tableHeight = $('.right-side').outerHeight() - $('.btns-container').outerHeight() - $('.condition-container').outerHeight() - headHeight - 86;
                }
                //必须用css方式设定，直接用.height()有时候会差60px
                if (tableHeight > 0) {
                    $('.dataTables_scrollBody').css({ height: tableHeight + 'px' });
                }
                return calcTableHeight;
            }


            //显示2位小数，四舍五入，转换到百分比%
            var CastFloatToPercent = function (floatPercent) {
                return ((floatPercent != null) && (floatPercent != undefined) && (floatPercent != 0)) ? (floatPercent * 100).toFixed(2) + "" : "0";
            };
            //显示2位小数，四舍五入
            var CastFloat = function (floatPercent) {
                return ((floatPercent != null) && (floatPercent != undefined) && (floatPercent != 0)) ? (floatPercent).toFixed(2) + "" : "0";
            };

            //加载数据
            var loadList = function () {

                //判断是否选择历史销售还是按周销售
                var year = $("#search-year").val() == "" ? "" : $("#search-year").val();
                var week = $("#search-week").val();
                if ($("input[id='radio-week']:checked").val() == "on") {
                    if (year == "") {
                        swal("以按周销售查询时--年份为必选");
                        return false;
                    }
                }

                if ($("input[id='radio-history']:checked").val() == "on") {
                    year = -1;
                    week = 0;
                }

                var kind = $("#search-KindNames").val();
                var searchKind = "";
                if (kind != undefined && kind != null) {
                    searchKind = kind.join(",");
                }


                //ajax参数
                var ajaxOptions = {
                    url: '/api.ashx?c=DwDetailsPercentageSetting&a=GetDwDetailsPercentageSettingList&u=',
                    type: "POST",
                    data: function (condition) {
                        condition.Year = year;
                        condition.Week = week;
                        condition.Category = searchKind;
                        condition.Gender = $("#search-Gender").val();
                        condition.Page = ((condition.start / condition.length) + 1).toFixed(0);
                        condition.Size = condition.length;
                    },
                    dataSrc: ProcessData,
                };

                var CheckNullAndUndefined = function (skc) {
                    return ((skc != null) && (skc != undefined)) ? skc : 0;
                }

                //拼接行
                var spliceRows = function (arrayData, index, length) {
                    var result = "";
                    var indexRow = index * 3;
                    //如果不是最后一条数据，一次插入3条数据
                    //如果到最后一条数据,后边没有对齐，就补空
                    var td1 = "<td class='td-bgcolor detail nodata' data-ishome=''></td><td class='td-bgcolor nodata'></td><td class='td-bgcolor nodata  hide'></td>";
                    var td2 = "<td class='td-bgcolor detail nodata' data-ishome=''></td><td class='td-bgcolor nodata'></td><td class='td-bgcolor nodata hide'></td>";
                    var td3 = "<td class='td-bgcolor detail nodata' data-ishome=''></td><td class='td-bgcolor nodata'></td><td class='td-bgcolor nodata  hide'></td>";
                    if (week == 0) {
                        if ((indexRow + 0) < length) {
                            td1 = "<td class='td-bgcolor detail' data-isHome='" + (arrayData[indexRow + 0].IsHome == null ? "" : arrayData[indexRow + 0].IsHome) + "'>" + arrayData[indexRow + 0].Detail + "</td>" +
                                "<td class='td-bgcolor'><span class='sub-item percentage'>" + CastFloatToPercent(arrayData[indexRow + 0].Persentage) + "<span/></td>" +
                                "<td class='td-bgcolor hide'><span class='sub-item standardskc'>" + CheckNullAndUndefined(arrayData[indexRow + 0].StandardSKC) + "<span/></td>";
                        }

                        if ((indexRow + 1) < length) {
                            td2 = "<td class='td-bgcolor detail' data-isHome='" + (arrayData[indexRow + 1].IsHome == null ? "" : arrayData[indexRow + 1].IsHome) + "'>" + arrayData[indexRow + 1].Detail + "</td>" +
                                "<td class='td-bgcolor'><span class='sub-item percentage'>" + CastFloatToPercent(arrayData[indexRow + 1].Persentage) + "<span/></td>" +
                                "<td class='td-bgcolor hide'><span class='sub-item standardskc'>" + CheckNullAndUndefined(arrayData[indexRow + 1].StandardSKC) + "<span/></td>";
                        }

                        if ((indexRow + 2) < length) {
                            td3 = "<td class='td-bgcolor detail' data-isHome='" + (arrayData[indexRow + 2].IsHome == null ? "" : arrayData[indexRow + 2].IsHome) + "'>" + arrayData[indexRow + 2].Detail + "</td>" +
                                "<td class='td-bgcolor'><span class='sub-item percentage'>" + CastFloatToPercent(arrayData[indexRow + 2].Persentage) + "<span/></td>" +
                                "<td class='td-bgcolor hide'><span class='sub-item standardskc'>" + CheckNullAndUndefined(arrayData[indexRow + 2].StandardSKC) + "<span/></td>";
                        }
                    }
                    else
                        {
                            if ((indexRow + 0) < length) {
                                td1 = "<td class='td-bgcolor detail' data-isHome='" + (arrayData[indexRow + 0].IsHome == null ? "" : arrayData[indexRow + 0].IsHome) + "'>" + arrayData[indexRow + 0].Detail + "</td>" +
                                    "<td class='td-bgcolor'><input type='number' class='sub-item percentage' value='" + CastFloatToPercent(arrayData[indexRow + 0].Persentage) + "' /></td>" +
                                    "<td class='td-bgcolor hide'><input type='number' class='sub-item standardskc' value='" + CheckNullAndUndefined(arrayData[indexRow + 0].StandardSKC) + "' /></td>";
                            }

                            if ((indexRow + 1) < length) {
                                td2 = "<td class='td-bgcolor detail' data-isHome='" + (arrayData[indexRow + 1].IsHome == null ? "" : arrayData[indexRow + 1].IsHome) + "'>" + arrayData[indexRow + 1].Detail + "</td>" +
                                    "<td class='td-bgcolor'><input type='number' class='sub-item percentage' value='" + CastFloatToPercent(arrayData[indexRow + 1].Persentage) + "' /></td>" +
                                    "<td class='td-bgcolor hide'><input type='number' class='sub-item standardskc' value='" + CheckNullAndUndefined(arrayData[indexRow + 1].StandardSKC) + "' /></td>";
                            }

                            if ((indexRow + 2) < length) {
                                td3 = "<td class='td-bgcolor detail' data-isHome='" + (arrayData[indexRow + 2].IsHome == null ? "" : arrayData[indexRow + 2].IsHome) + "'>" + arrayData[indexRow + 2].Detail + "</td>" +
                                    "<td class='td-bgcolor'><input type='number' class='sub-item percentage' value='" + CastFloatToPercent(arrayData[indexRow + 2].Persentage) + "' /></td>" +
                                    "<td class='td-bgcolor hide'><input type='number' class='sub-item standardskc' value='" + CheckNullAndUndefined(arrayData[indexRow + 2].StandardSKC) + "' /></td>";
                            }
                    }
                    result = "<tr>" + td1 + td2 + td3 + "</tr>";
                    return result;
                }

                //数组求和
                var arraySum = function (list) {
                    var totalPercentage = 0.0;
                    var totalStandardSKC = 0;
                    for (var i = 0; i < list.length; i++) {
                        totalPercentage += list[i].Persentage == null || list[i].Persentage == undefined ? 0 : list[i].Persentage;
                        totalStandardSKC += list[i].totalStandardSKC == null || list[i].totalStandardSKC == undefined ? 0 : list[i].totalStandardSKC;
                    }
                    return { totalPercentage: totalPercentage, totalStandardSKC: totalStandardSKC };
                };

                //绑定列
                var columns = [

                    {
                        data: null,
                        render: function (data, type, row, meta) {
                            var checkboxId = row.KindName + "-" + row.SexName + "-" + row.Week;
                            return '<input type="checkbox" class="checkbox select-single" id="' + checkboxId +
                                '" data-year="' + row.Year +
                                '" data-week="' + row.Week +
                                '" data-category="' + row.Category +
                                '" data-Gender="' + row.Gender +
                                '" />';
                        }
                    },
                    {
                        data: null, defaultContent: "历史销售",
                        render: function (data, type, row, meta) {
                            if (row.Week > 0) {
                                var content = row.Year + "年第" + row.Week + "周";
                                return content;
                            }
                        }
                    },
                    { data: "KindName", class: "KindName" },
                    { data: "SexName", class: "SexName" },
                    {
                        data: "list",
                        defaultContent: "...",
                        render: function (data, type, row, meta) {
                            if (data == undefined) {
                            }
                            else {
                                var subContent = '<table class="table table-bordered sub-table"> \
                                                    <thead> \
                                                    <tr> \
                                                        <th class="detail">小类细项</th> \
                                                        <th>占比</th> \
                                                        <th class="hide">标准SKC</th> \
                                                        <th class="detail">小类细项</th> \
                                                        <th>占比</th> \
                                                        <th class="hide">标准SKC</th> \
                                                        <th class="detail">小类细项</th> \
                                                        <th>占比</th> \
                                                        <th class="hide">标准SKC</th> \
                                                    </tr> \
                                                    </thead> ';
                                var content = "";
                                var length = data.length;
                                //根据数据长度判断有多少行
                                var rowCount = Math.ceil(length / 3);

                                for (i = 0; i < rowCount; i++) {
                                    content += spliceRows(data, i, length);
                                }
                                //添加合计行--start
                                if (data.length > 0) {
                                    var sum = arraySum(data);
                                    var totalPercentage = CastFloatToPercent(sum.totalPercentage);
                                    var totalStandardSKC = sum.totalStandardSKC;

                                    content += "<tr class='totalTr'>";
                                    content += "<td class='td-bgcolor total'>合计<\/td>";
                                    content += "<td colspan='5'  class='td-bgcolor total-percentage'>" + totalPercentage + "<\/td>";
                                    content += "<td colspan='4'  class='td-bgcolor total-standardskc hide'>" + totalStandardSKC + "<\/td>";
                                    content += "<\/tr>";
                                }

                                //添加合计行--end

                                content = "<tbody>" + content + "</tbody>";
                                var subTable = subContent + content + "<\/table>";
                                return subTable;
                            }
                        }

                    },
                ];

                //Dattables参数
                var options = {
                    ajax: ajaxOptions,
                    columns: columns,
                    searching: false,
                    ordering: false,
                    lengthChange: false,
                    retrieve: true,
                    destroy: true,
                    serverSide: true,
                    info: false,
                    processing: true,
                    scrollY: calcTableHeight(),
                    //scrollY: false,
                    //fixedHeader: true,
                    language: { url: "../assets/js/plugins/jQuery-DataTables/i18n/Chinese.json" },
                    initComplete: function (settings, json) {
                        //表格初始化完毕立即计算一次
                        calcTableHeight();
                    },
                }
                $("#main-body").DataTable(options);
            }


            //查询
            $('.btns-container').on('click', '#btn-search', function () {
                //$("#main-body").DataTable().clear(); 
                if ($("#main-body").DataTable() != undefined) {
                    $("#main-body").DataTable().clear();
                    $("#main-body").DataTable().destroy();
                }

                loadList();
            });

            //循环获取tr中的td
            var getSubObj = function (tr, listSub, start) {
                //获取小类细项中的值
                var td1 = tr.find("td:eq(" + (start + 0) + ")");
                var detail = td1.text();
                var ishome = td1.attr("data-ishome");
                var td2 = tr.find("td:eq(" + (start + 1) + ")");
                var percentage = td2.find(".percentage").val() * 1.0 / 100;
                var td3 = tr.find("td:eq(" + (start + 2) + ")");
                var standardskc = td3.find(".standardskc").val();
                var subObj = {
                    Detail: detail,
                    IsHome: ishome,
                    Persentage: percentage,
                    StandardSKC: standardskc,
                };
                listSub.push(subObj);
            };

            //保存
            $('.btns-container').on('click', '#btn-save', function () {

                //save
                var count = $("input[type=checkbox][class*='select-single']:checked").length;
                if (count > 0) {
                    //提交参数
                    var param = [];
                    //---------------获取所有选择的行------------start-------------
                    $("input[type=checkbox][class*='select-single']:checked").each(function () {
                        var table = $(this).parents('tr').find('table')
                        var arrayPercentage = table.find(".percentage");
                        var totalPercentage = 0.0;
                        arrayPercentage.each(function () {
                            totalPercentage += ($(this).val() * 1.0);
                        });
                        totalPercentage = totalPercentage.toFixed(3);
                        totalPercentage = (totalPercentage * 1.0).toFixed(2) * 1.0;
                        if (totalPercentage != 100.0) {
                            swal("占比合计为" + totalPercentage + "，不等于100%，不能保存！");
                            return false;
                        } else {

                            //---------------获取单行数据------------start-------------
                            var DetailPercentage = {
                                Year: $(this).attr("data-year"),
                                Week: $(this).attr("data-week"),
                                Category: $(this).attr("data-category"),
                                Gender: $(this).attr("data-gender"),
                                list: []
                            };
                            var listSub = [];
                            var trSub = table.find("tbody tr").not(".totalTr");

                            trSub.each(function () {
                                var subCount = $(this).find("td").not(".nodata").length;
                                if (subCount == 3) {
                                    getSubObj($(this), listSub, 0);
                                }
                                if (subCount == 6) {
                                    getSubObj($(this), listSub, 0);
                                    getSubObj($(this), listSub, 3);
                                }
                                if (subCount == 9) {
                                    getSubObj($(this), listSub, 0);
                                    getSubObj($(this), listSub, 3);
                                    getSubObj($(this), listSub, 6);
                                }
                            });
                            DetailPercentage.list = listSub;

                            //---------------获取单行数据------------end---------------
                            param.push(DetailPercentage);

                        };
                    });
                    //---------------获取所有选择的行------------end---------------
                    if (count == param.length) {

                        //提交数据
                        Y.API2('DwDetailsPercentageSetting', 'ModifyDwDetailsPercentageSetting', {
                            modifyList: param
                        }, function (data) {
                            if (data.Success == false) {
                                swal("保存失败！" + data.Message, "", "error");
                                return false;
                            } else {
                                //reload
                                if ($("#main-body").DataTable() != undefined) {
                                    $("#main-body").DataTable().destroy();
                                }
                                loadList();
                                swal("保存成功", "", "success");
                            }
                        });
                    }
                } else {
                    swal("请选中要保存的行");
                }
            });

            //加载历史周占比列表
            var loadHistroyWeek = function () {
                $(".history-ul").remove();
                var key = '';
                key = $("#search-left").val();
                Y.API2('DwDetailsPercentageSetting', 'GetLeftTitle', { Keys: key }, function (data) {
                    if (data.Success == false) {
                        swal(data.Message, '', 'error');
                    } else {
                        var content = "<ul class='history-ul'>";
                        if (data != undefined && data.length > 0) {
                            data.map(function (item) {
                                var liText = item.YearV + "年第" + item.Weekv + "周";
                                if (item.Weekv == 0) {
                                    liText = "历史销售占比";
                                }
                                content += "<li class='history-li' data-year='" + item.YearV + "' data-week='" + item.Weekv + "'>" + liText + "</li>";
                            });
                            
                            content += "</ul>";
                            $("#GetLeftTitle").append(content);
                        }
                    }
                });
            };

            //拼接应用周-年列表
            var spliceFutureYear = function (futureYear) {
                var contentYear = '<div class="panel"> <div class="panel-heading text-left">';
                contentYear += futureYear;
                contentYear += "</div>";
                contentYear += ' <div class="panel-body FutureWeek">';
                contentYear += '<ul class="FutureWeek-ul">';
                return contentYear;
            };

            //对应 拼接应用周-年列表
            var spliceEnd = "</ul></div>";

            //拼接应用周-周列表
            var spliceFutureWeek = function (year, futureWeek, sourceYear, sourceWeek) {
                var tooltipsContent = ' data-toggle="tooltip" data-placement="top" ';
                var contentWeek = '<li class="FutureWeek-li ';
                var tooltipsValue = '';
                if (sourceYear != null && sourceWeek != null) {
                    tooltipsValue = sourceYear + '年第' + sourceWeek + '周';
                    if (sourceWeek == 0) {
                        tooltipsValue = "历史销售占比";
                    }
                    contentWeek += ' FutureWeek-li-set" ';
                } else {
                    contentWeek += ' " ';
                }
                contentWeek += ' data-year="' + year + '" ';
                contentWeek += ' data-week="' + futureWeek + '" ';
                contentWeek += tooltipsContent;
                contentWeek += ' title="' + tooltipsValue + '" ';
                contentWeek += ">";
                contentWeek += "第" + futureWeek + "周";
                contentWeek += '<div style="height:0px" class="i"></div>';
                contentWeek += "</li>";
                return contentWeek;
            };

            //加载应用周列表
            var loadFutureWeek = function () {
                $(".future-ul").remove();
                Y.API2('DwDetailsPercentageSetting', 'GetRightDate', {}, function (data) {
                    if (data.Success == false) {
                        swal(data.Message, '', 'error');
                    } else {
                        if (data != undefined && data.length > 0) {
                            var yearContent = "";
                            yearContent = '<ul class="list-group future-ul">'
                            data.map(function (item) {
                                if (item.length > 0) {
                                    yearContent += '<li class="list-group-item">'
                                    var year = ((item[0].YearV == undefined || item[0].YearV == null) ? 0 : item[0].YearV);
                                    if (year > 0) {
                                        yearContent += spliceFutureYear(year);
                                    }
                                    yearContent += '</li">';
                                    var weekContent = "";
                                    item.map(function (subItem) {
                                        weekContent += spliceFutureWeek(year, subItem.Weekv, subItem.SourceYear, subItem.SourceWeek);
                                    });
                                    yearContent += weekContent;
                                    yearContent += spliceEnd;
                                }

                            });
                            //对应class future-ul
                            yearContent += '</ul>'
                            $("#FutureWeek").append(yearContent);
                        }
                    }
                });
            };

            //复制
            $('.btns-container').on('click', '#copyWeek', function () {
                $('#copyWindow > .editTitle').text('复制周占比');
                $("#search-left").val("");
                //加载历史周占比列表
                loadHistroyWeek();
                //加载应用周列表
                loadFutureWeek();
            });

            //获取历史销售
            $('.btns-container').on('click', '#btn-history-sales', function () {
                layer.msg('玩命加载中……', { icon: 16, shade: 0.5, time: 0, maxWidth: 200 });
                //提交数据
                Y.API2('DwDetailsPercentageSetting', 'CreateHistory', {}, function (data) {
                    layer.closeAll('dialog');
                    if (data.Success == false) {
                        swal("获取历史销售失败！" + data.Message, "", "error");
                        return false;
                    } else {
                        //reload
                        if ($("#main-body").DataTable() != undefined) {
                            $("#main-body").DataTable().destroy();
                        }
                        loadList();
                        swal("获取历史销售成功", "", "success");
                    }
                });
            });

            //全选/反选
            var checkAll = function () {
                if ($(".select-all").prop("checked")) {
                    //如果全选未选中，就选择全部
                    $("input[type=checkbox]").prop("checked", true);
                } else {
                    //如果是全选，就取消全部
                    $("input[type=checkbox]").prop("checked", false);
                }
            };

            loadList();

            $(".dataTables_scrollHead").on("click", ".select-all", function () {
                checkAll();
            });

            //复制周占比搜索
            $(".history-week").on("input propertychange", "#search-left", function () {
                //加载历史周占比列表
                loadHistroyWeek();
            });

            //选中历史周事件
            $("#GetLeftTitle").on("click", ".history-li", function () {
                if ($(this).hasClass("bg-selected")) {
                    $(this).parent().children().removeClass("bg-selected");
                } else {
                    $(this).siblings().removeClass("bg-selected");
                    $(this).addClass("bg-selected");
                }
            });

            //选中应用周事件
            $("#FutureWeek").on("click", ".FutureWeek-li", function () {
                if ($(this).hasClass("future-selected")) {
                    $(this).removeClass("future-selected");
                    $(this).find("div.i").html("");
                } else {
                    $(this).addClass("future-selected");
                    $(this).find("div.i").append('<i class="fa fa-check icon"></i>');
                }
            });

            //复制周占比弹窗--应用
            $("#copyWindow").on("click", "#copyModuleBtn", function () {
                //复制周占比
                var param = {};
                if ($(".history-li[class*=bg-selected]").length > 0) {
                    $(".history-li[class*=bg-selected]").each(function () {
                    });
                } else {
                    swal("请选择左侧要复制的周");
                    return false;
                }
                if ($(".FutureWeek-li[class*=future-selected]").length > 0) {
                    param.SourceYear = $(".history-li[class*=bg-selected]").attr("data-year");
                    param.SourceWeek = $(".history-li[class*=bg-selected]").attr("data-week");
                    var list = [];
                    $(".FutureWeek-li[class*=future-selected]").each(function () {
                        var futureWeek = {};
                        futureWeek.TargeYear = $(this).attr("data-year");
                        futureWeek.TargeWeek = $(this).attr("data-week");
                        list.push(futureWeek);
                    });
                    param.list = list;
                    //提交参数
                    if (param.SourceYear != undefined && param.SourceYear != null) {
                        Y.API2('DwDetailsPercentageSetting', 'WeekCopy', param,
                            function (data) {
                                if (data.Success == false) {
                                    swal("复制失败！" + data.Message, "", "error");
                                    return false;
                                } else {
                                    //reload
                                    if ($("#main-body").DataTable() != undefined) {
                                        $("#main-body").DataTable().destroy();
                                    }

                                    $("#closeAddBox").click();
                                    loadList();
                                    swal("复制成功", "", "success");
                                }
                            });
                    }
                } else {
                    swal("请选择右侧要应用的周");
                    return false;
                }
            });


            //批量设置SKC
            $('.btns-container').on('click', '#setskcBtn', function () {
                $('#setskcWindow > .editTitle').text('批量设置标准SKC');

                $("#search-skc-year").val("");
                $("#search-skc-week").val("");
                $("#search-skc-category").selectpicker('refresh');
                $("#search-skc-ItemNames").selectpicker('refresh');
                $("#search-skc-gender").val("");
                $("#skc").val("");
                $("#skc").removeClass("warning").addClass("required");
                $("#message").hide();

            });


            //批量设置SKC弹窗--保存
            $("#setskcWindow").on("click", "#saveModuleBtn", function () {
                if (!CheckDataValid('#checkModuleForm')) {
                    return false;
                }

                var kindArr = $("#search-skc-category").val();
                var kinds = "";
                if (kindArr != null) {
                    kinds = kindArr.join(',');
                }

                var itemArr = $("#search-ItemNames").val();
                var items = "";
                if (itemArr != null) {
                    items = itemArr.join(',');
                }


                //批量设置SKC
                var param = {};
                param.Year = $("#search-skc-year").val();
                param.Week = $("#search-skc-week").val();
                param.Category = kinds;
                param.Detail = items;
                param.Gender = $("#search-skc-gender").val();
                param.StandardSKC = $("#skc").val();

                //提交参数
                if (param.Year != undefined && param.Year != null) {
                    Y.API2('DwDetailsPercentageSetting', 'BatchDwDetailsPercentageSetting', param,
                        function (data) {
                            if (data.Success == false) {
                                swal("设置失败！" + data.Message, "", "error");
                                return false;
                            } else {
                                //reload
                                if ($("#main-body").DataTable() != undefined) {
                                    $("#main-body").DataTable().destroy();
                                }
                                $("#closeModuleBox").click();
                                loadList();
                                swal("设置成功", "", "success");
                            }
                        });
                }

            });

            //选中历史销售时，禁用年周 
            $(".condition").on("click", "input[type=radio]", function () {
                if ($("input[id='radio-history']:checked").val() == "on") {
                    $("#search-year,#search-week").prop("disabled", true);
                    $('#btn-save').attr('disabled', 'disabled');
                } else {
                    $("#search-year,#search-week").prop("disabled", false);
                    $('#btn-save').removeAttr("disabled");
                }
            });


            //重新计算表格高度
            $(window).resize(function () {
                calcTableHeight();
            });

            calcTableHeight();
            $("[data-toggle='tooltip']").tooltip();

            //输入占比实时计算占比总计
            $("#main-body").on("input propertychange", ".percentage", function () {
                var total = 0;
                $(this).parent().parent().parent().find(".percentage").each(function () {
                    total += ($(this).val() * 1);
                });
                total = CastFloat(total);
                $(this).parent().parent().parent().find(".total-percentage").text(total);
            });

            //输入占比实时计算skc总计
            $("#main-body").on("input propertychange", ".standardskc", function () {
                var total = 0;
                $(this).parent().parent().parent().find(".standardskc").each(function () {
                    total += ($(this).val() * 1);
                });
                $(this).parent().parent().parent().find(".total-standardskc").text(total);
            });
        });
    </script>
</asp:Content>
